<template>
    <el-row class="flex flex-ai-center flex-row" >
        <div class="main-header-title">
            <!-- 2020/08/11 UI无需收缩菜单功能 隐藏-->
            <!-- <i style="cursor: pointer;float: left;" class="icon-l-r" :class="sliderIsCollapse ? 'right' : 'left'" @click="toggleSlider()"></i> -->
        </div>

        <div class="flex1">

        </div>

        <div class="cw flex-ai-center" style="z-index: 940522;">
            <user-info></user-info>
            <!--<header-sum></header-sum>-->
            <!--<span @click="toIndex">首页</span>-->
            <!--<span @click="toOta">管理平台</span>-->
            <!--<span><a class="cw" target="_blank" href="http://www.baidu.com">帮助文档</a></span>-->
        </div>
        <!-- <div class="user-info flex flex-center cw" v-else style="margin-right: 20px">
            <span>登录</span>
            <span class="ml10">注册</span>
        </div> -->
    </el-row>
</template>

<script>

import userInfo from './userInfo'

export default {
    data () {
        return {
            isCollapse: true
        }
    },
    components: {
        userInfo
    },
    computed: {
        userInfo () {
            return this.$store.state.userInfo || {}
        },
        sliderIsCollapse () {
            return this.$store.state.sliderIsCollapse
        }
    },
    created () {

    },
    methods: {
        toggleSlider () {
            this.$store.commit('sliderIsCollapse', !this.sliderIsCollapse)
        }

    }
}

</script>

<style lang="scss" scoped rel="stylesheet/scss">
    @import "../assets/css/config";
    .cw {
        span {
            margin-left: 10px;
            cursor: pointer
        }
    }
    .el-row{
        flex:1;
    }
    .main-header-title{
        font-size: 20px;
        padding-left: 20px;
    }
    .header-lo{
        color: #fff;
        padding-left: 20px;
        font-size: 18px;
    }
    .icon-l-r{
        display: inline-block;
        width: 20px;height: 20px;
    }
    .left{
        background: url("../assets/left.png") no-repeat left bottom;
    }
    .right{
        background: url("../assets/right.png") no-repeat  left bottom;
    }

    .el-menu-vertical-demo:not(.el-menu--collapse) {
        width: 200px;
        min-height: 400px;
    }

</style>
